<template>
	<div class="pbody">
		<el-container>
			<el-header>
				<nav class="navbar navbar-default navbar-fixed-top ">
					<div class="container-fluid">
						<!-- Brand and toggle get grouped for better mobile display -->
						<div class="navbar-header">
							<a class="navbar-brand" href="#"><router-link to="/">首页</router-link></a>
						</div>
						<ul class="nav navbar-nav navbar-right">
							<li class="dropdown">
								<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">用户中心 <span class="caret"></span></a>
								<ul class="dropdown-menu">
									<li>
										<router-link to="/login">登录</router-link>
									</li>
									<li>
										<router-link to="/registered">注册</router-link>
									</li>
								</ul>
							</li>
						</ul>
					</div>
				</nav>
			</el-header>
			<el-container>
				<el-aside width="250px">
					<user-manage :lists="lists"></user-manage>
				</el-aside>
				<el-main>
					<router-view></router-view>
				</el-main>
			</el-container>
		</el-container>
	</div>
</template>

<script>
	import UserManage from '@/components/UserManageNav.vue'
	import axios from 'axios'
	export default {
		data() {
			return {
				activeIndex2: '1',
				lists: []
			}
		},
		components: {
			UserManage
		},
		mounted() {
			axios({
				url: '/user/getme',
				method: 'POST',
				data: {} //username usertel address jobnum
			}).then((res) => {
				this.lists = res.data.data;
			})
		},
		methods: {}
	}
</script>

<style>
	.user_message {
		margin-left: 80%;
	}
	
	.user_login,
	.user_registered {
		text-align: center;
		/*width: 40px !important;*/
	}
	
	.el-aside {
		color: #333;
		text-align: center;
	}
	
	.el-main {
		color: #333;
		text-align: center;
	}
	
	.el-container {
		margin-bottom: 40px;
	}
	
	.dropdown-menu li {
		/*width: 60px;*/
		text-align: center;
	}
</style>